<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<meta http-equiv="X-UA-Compatible" content="ie=edge" />
	<title>主要成员</title>
	<link rel="stylesheet" href="../css/mui.min.css">
	<link rel="stylesheet" href="../css/public.css" />
	<link rel="stylesheet" href="../css/fund.css">
</head>
<body>
	<header id="header" class="mui-bar mui-bar-nav jjs-header members-header">
		<div id="segmentedControl" class="mui-segmented-control">
			<a class="mui-control-item mui-active" href="#item1">当前主要成员</a>
			<a class="mui-control-item" href="#item2">投资决策成员</a>
		</div>
		<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left header-left-result"></a>
		<a class="mui-icon mui-icon-bars mui-pull-right header-right"></a>
	</header>
	<div class="mui-content members-content">
		<div id="item1" class="mui-control-content mui-active">
			<div id="scroll2" class="mui-scroll-wrapper scroll2" data-scroll="1">
				<div class="mui-scroll">
					<table class="mui-table">
						<thead>
							<tr>
								<th>编号</th>
								<th>姓名</th>
								<th>学历</th>
								<th>当前职位</th>
								<th>个人简历</th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td>1</td>
								<td>李放心</td>
								<td>博士</td>
								<td>基金经理</td>
								<td><a href="#">详情</a></td>
							</tr>
							<tr>
								<td>1</td>
								<td>李放心</td>
								<td>博士</td>
								<td>基金经理</td>
								<td><a href="#">详情</a></td>
							</tr>
						</tbody>
					</table>
				</div>
			</div>
		</div>
		<div id="item2" class="mui-control-content">
			<table class="mui-table">
				<thead>
					<tr>
						<th>编号</th>
						<th>姓名</th>
						<th>学历</th>
						<th>当前职位</th>
						<th>个人简历</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<td>11</td>
						<td>李放心</td>
						<td>博士</td>
						<td>基金经理</td>
						<td><a href="#">详情</a></td>
					</tr>
					<tr>
						<td>11</td>
						<td>李放心</td>
						<td>博士</td>
						<td>基金经理</td>
						<td><a href="#">详情</a></td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>
	<script src="../js/jquery.min.js"></script>
	<script src="../js/mui.min.js"></script>
	<script src="../js/public.js"></script>
	<script>
		$(function(){
			var headerW = $("#header div").width();
			$("#header div").css({"marginLeft":-headerW/2+'px'})
		})
			mui.init({
				swipeBack : false,//侧滑返回组件
				pullRefresh : {
				
					container : '.scroll2', //一个功能的一部分
					down : {
						callback : pulldownRefresh,//callback事件回调冒号后面就是方法
						height : 50,
						auto : false,
						contentdown : "下拉可以刷新",
					},
					up : {
				      height:50,//可选.默认50.触发上拉加载拖动距离
				      auto:true,//可选,默认false.自动上拉加载一次
				      contentrefresh : "正在加载...",//可选，正在加载状态时，上拉加载控件上显示的标题内容
				      contentnomore:'没有更多数据了',//可选，请求完毕若没有更多数据时显示的提醒内容；
				      callback :function(){
				      	var self = this;
				      	loadMore(this);
				      } //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
				    }
				
				}
			});
		
		
		function pulldownRefresh() {
				setTimeout(function() { //三秒后执行函数
					var html = '';
					for(var i=0;i<1;i++){
						html+='<tr>'
							+'	<td>1</td>'
							+'	<td>李放心</td>'
							+'	<td>博士</td>'
							+'	<td>基金经理</td>'
							+'	<td><a href="#">详情</a></td>'
							+'</tr>'
						
					}
					$(".members-content table tbody").html(html)
					
					mui('.scroll2').pullRefresh().endPulldownToRefresh(); //用来停止刷新
				}, 1000);
		}
		var loadMore = function(pullRefresh) {
			pullRefresh.endPullupToRefresh(false);
		 	var str=""
			for(var i=0;i<1;i++){
				str+= '<tr>'
					+'	<td>1</td>'
					+'	<td>李放心</td>'
					+'	<td>博士</td>'
					+'	<td>基金经理</td>'
					+'	<td><a href="#">详情</a></td>'
					+'</tr>'	
				
			}
			$(".members-content table tbody").append(str)
		};
	</script>
</body>
</html>